手順 2：ウィジェットの初期化とカスタマイズ

前の手順では、マークアップを追加し、カレンダーに表示するコンテンツを追加しました。ここでは、jQuery スクリプトを追加し、ウィジェットを初期化して、さらに、allowPreview、minDate、maxDate、navButtons の各オプションを設定して wijcalendar コントロールをカスタマイズできます。

前の手順で追加した終了の </div> タグの後に、次の jQuery スクリプトを入力して、wijcalendar ウィジェットを初期化します。

ソースビュー	コードのコピー
<script id="scriptInit" type="text/javascript"> $(document).ready(function () { $("#calendar1").wijcalendar({ minDate: new Date('2012/02/16'), maxDate: new Date('2012/02/25'), allowPreview: true, navButtons: 'quick', quickNavStep: 6, easing: "easeInBounce", duration: 2500, titleFormat: "MMM yyyy" }); }); </script>

ソースビュー

コードのコピー

<script id="scriptInit" type="text/javascript">
    $(document).ready(function () {
        $("#calendar1").wijcalendar({
            minDate: new Date('2012/02/16'),
            maxDate: new Date('2012/02/25'),
            allowPreview: true,
            navButtons: 'quick',
            quickNavStep: 6,
            easing: "easeInBounce", duration: 2500,
            titleFormat: "MMM yyyy" 
        });
    });
</script>